<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Welcome!</title>
		<link rel="stylesheet" href="js/bower_components/bootstrap/dist/css/bootstrap.min.css">
		<link rel="stylesheet" href="js/bower_components/bootstrap-select/dist/css/bootstrap-select.min.css">
		<link rel="stylesheet" href="js/bower_components/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css">
		<link rel="stylesheet" href="js/bower_components/bootstrap-table/dist/bootstrap-table.min.css">
		<link rel="stylesheet" href="js/bower_components/bootstrap-treeview/dist/bootstrap-treeview.min.css">
		<link href="js/bower_components/bootstrap-datetimepicker-master/css/bootstrap-datetimepicker.min.css"
			rel="stylesheet">
		
		<script src="js/bower_components/jquery/dist/jquery.min.js"></script>
		<script src="js/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
		<script src="js/bower_components/bootbox.min.js"></script>
		<script src="js/bower_components/bootstrap-select/js/bootstrap-select.js"></script>
		<script src="js/bower_components/bootstrap-switch/dist/js/bootstrap-switch.min.js"></script>
		<script src="js/bower_components/bootstrap-table/dist/bootstrap-table.min.js"></script>
		<script src="js/bower_components/bootstrap-table/dist/locale/bootstrap-table-zh-CN.js"></script>
		
		<script src="js/bower_components/bootstrap-treeview/dist/bootstrap-treeview.min.js"></script>
		<script src="js/bower_components/jquery-form-validator/form-validator/jquery.form-validator.min.js"></script>
		<script src="js/bower_components/moment/min/moment-with-locales.min.js"></script>
		<script src="js/bower_components/bootstrap-datetimepicker-master/js/bootstrap-datetimepicker.min.js"></script>

		<title>首页</title>
		<script>
		var currentTime=function(){
			$("#currentTime").html(moment().format("yyyy-mm-dd dddd hh:mm:ss"));
		}
		
		$(function(){
			//启动定时器刷新日期
			setInterval(currentTime,1000);
			User={"userid":2}
			
			//左侧导航
			$.ajax({
				type:"put",
				url="http://localhost:2078/myuser/getDaoHang",
				async:true,
				contentType: "application/json;charset=utf-8",
				data: JSON.stringify(User),
				dataType: "json",
				success: function(res) {
					console.log("获取后端导航的返回结果是：")
					console.log(res);
					$("tree").treeview({
						data:res,
						selectedBackColor:"0F3E6E",
						selectedIcon:"glyphicon glyphicon-ok",
						expandIcon:"glyphicon glyphicon-plus",
						onNodeSelected:function(event,data){
							console.log(data);
							var parent=$("#tree").treeview("getNode",data.parentId);
							console.log(parent);
							$("#breadcrumb").html("<li>"+parent.text+"</li>"+"<li>"+data.text+"</li>");
							$("#contentFrame").attr("src",data.href);
							console.log("======")
						}
					});
				}
			});
		})
		</script>
		
	</head>
	<body>
		<div class="container-fluid">
			<!--第一个区域 头部-->
			<div class="row">
				<div class="col-md-12">
					<h1 style="float: left;margin-top: 0px;">
						<small>后台管理系统</small>
					</h1>
					<dir style="font-size: 210%;float: right;margin-right: 0px;">
						<span class="glyphicon glyphicon-time"></span>
						<span id="currentTime"></span>
						<span class="glyphicon glyphicon-user"></span>
						<b>欢迎你</b>
						<span id="username">管理员</span>
						<button class="btn btn-danger"><span class="glyphicon glyphicon-off">&nbsp;注销</span></button>
					</dir>
				</div>
			</div>
			
			<!--第二个区域 -->
			<div class="row">
				<!--左侧 导航 -->
				<div class="col-md-3">
					<div id="tree"></div>
				</div>
				
				<!--右侧 工作区 -->
				<div class="col-md-9">
					<!--当前界面所处模块的位置 -->
					<div class="row">
						<div class="col-md-12">
							<ol class="breadcrumb" id="breadcrumb">
								<li>
									<a href="#" target="contentFrame">首页</a>
								</li>
							</ol>
						</div>
					</div>
					<!--当前界面模块的内容 -->
					<div class="row">
						<div class="col-md-12">
							<div class="embed-responsive embed-responsive-16by9">
								<iframe name="contentFrame" id="contentFrame" class="embed-responsive-item src="search.html></iframe>
							</div>
						</div>
					</div>
				</div>
				
			</div>
		</div>
		
		
		
	</body>
</html>
